The VBScript programming language is only half of Microsoft's current Internet programming strategy. The other half is ActiveX, a way to develop programmable objects that can be added to Web pages alongside images, text, Java applets, and other media.
VBScript provides access to the intrinsic HTML controls-buttons, text fields, radio buttons, and other things that are common to Web-based forms. You encounter these controls any time you register to join a Web site, order a product through the Web, or use a feedback page to tell Shaquille O'Neal how much you enjoy http://www.shaq.com.
If you want to create sophisticated programs to run on a Web page, you might want to extend the possibilities beyond intrinsic controls by using ActiveX controls.
ActiveX controls are components that extend the capabilities of Web pages. They were previously known as OCX or OLE controls, a type of software-development component that might be familiar to some readers.
An ActiveX control is developed using a language such as Visual C++, Visual Basic, or Delphi. Like an OCX, an ActiveX component is designed to be used by some other software-a Web browser, in this case.
More than 1,000 ActiveX controls are available for use, according to Microsoft. In addition to being usable on Web pages, these controls can be used with other types of software developed with programming languages such as Java, Borland C++ and Delphi, Visual Basic, and Visual C++.
These controls are developed in other languages, but their operation can be modified and customized with the use of HTML code and VBScript programs. ActiveX controls are placed on a Web page using a special extended HTML tag called <OBJECT> and a supporting tag called <PARAM>.
The <OBJECT> tag, proposed by the World Wide Web Consortium as a future standard, is used to place an object on a Web page. The primary type of object discussed in this chapter is an ActiveX control, but the tag considers an object to be any type of media that can be put on a page. <OBJECT> was proposed by the Consortium as a way to replace several current HTML tags and attributes-the <IMG> tag, the Java <APPLET> tag, the DYNSRC attribute used for audio and video by Microsoft, and other proprietary extensions to HTML. <OBJECT> also is flexible enough in design to handle new forms of media not yet invented for the Web.
Attributes are used with the <OBJECT> tag to specify the following information:
If the object has parameters, they can be set with the <PARAM> tag. This tag has two attributes: NAME and VALUE. The NAME attribute gives the parameter a name, and VALUE sets up a value for that parameter.
Although <OBJECT> is intended to be used with a broad range of media, the only example of it in current use is the ActiveX control.
As you'll see later in this chapter, when you use the ActiveX Control Pad to add an ActiveX object to a Web page, an <OBJECT> tag is added automatically to the page. Here's an example of an ActiveX control's <OBJECT> tag:
<OBJECT ID="SpinButton1" WIDTH=16 HEIGHT=32
CLASSID="CLSID:79176FB0-B7f2-11CE-97EF-00AA006D2776">
<PARAM NAME="Size" VALUE="423;846">
</OBJECT>
This <OBJECT> tag creates an ActiveX spin button control with up and down arrows to change a value. Java programmers will recognize the <PARAM> tag, because it has the same attributes (NAME and VALUE) and the same usage as it does with the Java <APPLET> tag. Eventually, Microsoft Internet Explorer and other browsers plan to enable the <OBJECT> tag to handle Java applets in addition to ActiveX controls.
Because this HTML code is added automatically by the ActiveX Control Pad, you do not need to enter it yourself into a Web page's HTML file. However, an understanding of the elements of an <OBJECT> tag will help you understand ActiveX controls.
The ID attribute of the <OBJECT> tag gives the object a name. One of the biggest advantages of VBScript and ActiveX is the capability of one object to communicate with another object. A VBScript program can be used for one element on a page-for example, a <FORM> button-to modify another program, such as an ActiveX control. ID is needed for one object to know how to contact another.
The CLSID attribute identifies the type of object and provides some identifying characteristics of the object. In the preceding example, the CLSID was set to a complicated string of numbers and letters:
CLSID:79176FB0-B7f2-11CE-97EF-00AA006D2776
This has two parts. The section before the colon, CLSID, identifies this object as an ActiveX control. Another example of an identifier would be java:, representing an applet programmed in that language.
The section after the colon indicates some registration information that reveals where the ActiveX control can be found on the user's Windows system. ActiveX controls are downloaded to the user's system and run locally. The CLSID gives the browser enough information to find, identify, and run the control. It also creates a unique identifier for the ActiveX control. No matter how many ActiveX controls are implemented across the Internet, each will use part of the CLSID to establish its identity.
ActiveX controls, previously known as OCX or OLE controls, offer added functionality to Web page developers. In addition to being usable on the World Wide Web, ActiveX controls have an advantage over other Internet programming solutions such as Java applets and Netscape plug-ins.
These controls can be used immediately in other applications. For example, a control that performs an image editing task on the Web can be plugged into a software program as easily as it was placed on a page.
ActiveX controls are downloaded from the Web and executed locally on the user's computer. An ActiveX-enabled Web browser will behave differently if it encounters a new control than if it has seen the control previously.
If you are using a browser that can handle ActiveX controls and you come to a page containing a control, a check will be made to determine whether you have downloaded the control previously. This check will use the CLSID attribute of the <OBJECT> tag to determine whether the ActiveX control is present on your system.
If you haven't downloaded the control previously, a special certificate window will be opened that is similar to the one shown in Figure 12.1.
Figure 12.1 : An ActiveX control verification certificate.
This certificate is part of ActiveX's security plan. Because ActiveX controls are executed on the user's system, there is obvious potential for a programmer to run malicious code. In order to run an ActiveX control, you need some means of identifying the author as a trustworthy source.
The VeriSign company is handling ActiveX developer certification for a large number of the existing controls. The certificate window that opens when you encounter a new control on a Web page has a link to a control verification source such as VeriSign and probably a link to the developer's Web site.
As the certification window states, you should click the links
on the certificate before accepting its validity. If you're satisfied
that everything looks legitimate, you can click Yes to download
and install the control.
| CAUTION |
In the certification window, checkboxes enable you to reduce the number of security checks that you require for future checks. You can accept every future control from a company, or even every future control that comes from the verification company such as VeriSign. Although ActiveX is still in relative infancy as a technology, it seems prudent to leave these checkboxes blank. You must go through more security checks before loading a control, but the loss in time should be regained by the more secure environment. When ActiveX and control verification systems such as VeriSign have become more established, you can elect to accept all of their certifications without question |
If you elect to download a control, it downloads and begins running automatically. Figure 12.2 shows the CyberGO ActiveX control, which can be used with Internet Explorer 3.0 after a security certificate is accepted. To try CyberGO, visit the following Web page:
http://www.brlabs.com/cybergo/cybergostart.html
Figure 12.2 : An ActiveX control, the CyberGo game from Brilliance Labs.
After the control has been downloaded and executed, it remains on the user's computer so that it does not have to be reloaded each time the control is found on a Web page. The only time that an ActiveX control will be downloaded more than once is when a new version is offered that the user does not yet have.
This enables much quicker access to an ActiveX control than is presently possible with Java applets, which download again each time they are encountered. However, the disadvantage is that ActiveX controls take up space on a user's hard drive. In the present version of Internet Explorer, ActiveX controls are stored in a subdirectory called Windows/Occache.
To see a sampling of the ActiveX controls that have been made available, the Internet information service CNET has introduced an ActiveX file directory and news site at the following URL:
http://www.activex.com
When a control is on your system, you can use it as a component in your own Web pages and software projects. CNET's ActiveX site has many controls available that cater to programmers in need of useful components.
At the time of this writing, Microsoft Internet Explorer 3.0 is the only popular browser that implements VBScript and ActiveX controls as part of its "out-of-the-box" functionality. (Given that most people acquire Internet Explorer through an Internet download, however, that box metaphor might be outdated-perhaps "out-of-the-executable-archive"?)
Netscape Navigator, the browser used by more than 70 percent of the Web's audience at present, can handle ActiveX and VBScript through special software called a plug-in. If you're unfamiliar with the term, a plug-in is software that has an established link to existing software. This link enables the plug-in to add functionality to the core program. Many Internet users listen to audio programming over the Net by using a RealAudio plug-in. When Netscape or Internet Explorer encounters a RealAudio file, the software knows to run a RealAudio player program to read in the file and crank up the pc's audio.
ncompass Labs has developed an ActiveX plug-in called ScriptActive for users of some versions of Netscape Navigator. It currently works on Windows 95, NT, and 3.5.1 systems running Navigator 3.0 or Navigator Gold 3.0. You must be running a 486 or better pc with 8MB of RAM.
The ScriptActive plug-in is offered for a free 30-day trial period, after which it must be purchased from ncompass. Send e-mail to ncompass@ncompasslabs.com for current pricing information.
If you have the right software and system, you can download the ncompass ScriptActive plug-in from the following URL:
http://www.ncompasslabs.com/binaries/index.htm
The file is about 3.5MB in size, so it can take 30 minutes or more to download depending on the speed of your Internet connection. When it's done, you have a single executable file. Run it to start the ScriptActive setup program, which takes you through the steps required to add the plug-in to your version of Navigator.
During the installation, the setup program attempts to find where Navigator is located on your system. If it locates Navigator, you can confirm that it's the right version of the software, or choose a different location manually. If no version of Navigator is found, you'll have to find it yourself to continue installing ScriptActive.
One question you might be asked during the installation process is whether to replace an existing file with an older one that came with ScriptActive. ScriptActive, like most Windows software, uses dynamic link libraries (DLLs) that take care of some tasks. These libraries are often shared between programs, so you might have a better, newer version of a DLL than the one ScriptActive wants to install.
If you're asked whether to replace an existing file with an older version of it, you should keep the existing file in almost all circumstances. If you don't, it might alter the performance of some other software on your system.
After the installation is complete, you have to restart your system in order for the plug-in to work correctly.
After you have downloaded and finished installing ScriptActive, you're ready to try it out. Load Netscape Navigator if it isn't already loaded, and visit the following URL:
http://www.ncompasslabs.com/products/scriptactive_link.htm
This page has a link to a showcase of ScriptActive techniques. The plug-in enables VBScript and ActiveX, and it also works with JavaScript, the scripting language developed by Netscape that is similar in scope and function to VBScript. Figure 12.3 shows an example of one of these showcase ActiveX controls running on Netscape Navigator.
Figure 12.3 : An ActiveX control running on Netscape Navigator 3.0.
This is one of the advantages of the present competitiveness in the browser market. Because companies are after the widest possible segment of the Web audience, a "kitchen sink" approach is being taken toward new technology. If Netscape comes up with a new idea that gains popularity, Microsoft won't be far behind in adopting it or adopting a compatible solution.
The time you spend learning something such as ActiveX and VBScript can help you reach an audience beyond the users of Microsoft Internet Explorer. As more evidence of this, ncompass Labs offers as part of its ScriptActive package a tool to read <OBJECT> tags in HTML files and add <EMBED> tags to accompany them. The <EMBED> tag is Netscape's current implementation of an <OBJECT> tag, and the ScriptActive tool makes an ActiveX page work for both Internet Explorer 3.0 and Netscape Navigator 3.0.
As you saw earlier, ActiveX controls are added to an HTML page by using the <OBJECT> tag. This is normally placed in a document automatically by a tool such as the ActiveX Control Pad. You get a chance to use that software in the next chapter.
Here, you will create an HTML page and add an <OBJECT> to the page manually.
Enter the full text of Listing 12.1 into any text editor, and save the file as object.html. If your editor has a special file format, as Microsoft Word does, make sure to choose the ASCII text or plain text option when saving the HTML file.
Listing 12.1. The full HTML source code of object.html.
1: <HTML> 2: <HEAD> 3: </HEAD> 4: <BODY> 5: <FORM NAME="Form"> 6: <OBJECT ID="TextBox1" WIDTH=96 HEIGHT=24 7: CLASSID="CLSID:8BD21D10-EC42-11CE-9E0D-00AA006002f3"> 8: <PARAM NAME="VariousPropertyBits" VALUE="746604571"> 9: <PARAM NAME="Size" VALUE="2540;635"> 10: <PARAM NAME="FontCharSet" VALUE="0"> 11: <PARAM NAME="FontPitchAndFamily" VALUE="2"> 12: <PARAM NAME="FontWeight" VALUE="0"> 13: </OBJECT> 14: </FORM> 15: </BODY> 16: </HTML>
When you're done, load the object.html page into Internet Explorer 3.0, or Netscape Navigator 3.0 if you have installed the ScriptActive plug-in. The page should resemble the one in Figure 12.4.
Figure 12.4 : The output of object.html in Internet Explorer 3.0.
ActiveX controls have several properties that can be set up using the <PARAM> tag. The properties vary based on the kind of control: The one in the example is a plain text box like those used with the HTML <FORM> tag.
Controls typically are highly customizable through the use of properties. The five <PARAM> tags set here are only a small portion of the total number of properties associated with these text box controls.
The CLASSID attribute to the <OBJECT> tag identifies the type of object. At present, when <OBJECT> is used solely to place ActiveX controls on a page, this identifier is not as important as it will be later if the tag becomes a Web standard. In this case, the clsid: portion of CLASSID indicates that the object is an ActiveX control, and the remainder of CLASSID is an unwieldy alphanumeric string. This string identifies the type of control and its location on the user's system.
The ID attribute is set up so that an object can communicate with other objects-VBScript programs, other controls, Java applets, or anything else that is compatible with ActiveX controls.
The Web page you have created has a text field, but it's a little obtuse without a label indicating what is supposed to be entered in the field. The most basic ActiveX controls are intrinsic HTML form objects-buttons, text fields, radio buttons, and the other elements of a Web page form.
When these are created as ActiveX controls, you don't use HTML code such as the following:
<INPUT NAME="permit" TYPE=Radio VALUE="Yes">
Instead, you add the form element to a Web page using the <OBJECT> tag, because it gives you much more control over the element's appearance and behavior. To add a label in front of the text field that you have created in object.html, open the file and insert a blank line right after the <BODY> tag. In the space you just opened up, add the following <OBJECT> HTML code:
<OBJECT ID="Label1" WIDTH=96 HEIGHT=24
CLASSID="CLSID:978C9E23-D4B0-11CE-Bf2D-00AA003f40D0">
<PARAM NAME="Caption" VALUE="The meaning of life (5 words or less): ">
<PARAM NAME="Size" VALUE="2540;635">
<PARAM NAME="FontCharSet" VALUE="0">
<PARAM NAME="FontPitchAndFamily" VALUE="2">
<PARAM NAME="FontWeight" VALUE="0">
</OBJECT>
This puts a label in front of the text field. The Caption parameter sets the value of the label's caption, and the WIDTH and HEIGHT attributes set the size of the element. This is one immediate benefit of using a control form object instead of standard HTML: You can change the size. As the other parameters indicate, you can change the appearance as well.
Because these elements have been created as controls, you can access and modify their properties from VBScript. To see this in action, add a button that checks whether the correct answer has been entered in the text field.
Return to object.html and add a blank line above the </BODY> tag at the bottom of the document. At the spot of that blank line, add the following HTML code:
<P>
<OBJECT ID="cmdGuess" WIDTH=96 HEIGHT=32
CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57">
<PARAM NAME="Caption" VALUE="Am I Right?">
<PARAM NAME="Size" VALUE="2540;846">
<PARAM NAME="FontCharSet" VALUE="0">
<PARAM NAME="FontPitchAndFamily" VALUE="2">
<PARAM NAME="ParagraphAlign" VALUE="3">
<PARAM NAME="FontWeight" VALUE="0">
</OBJECT>
The Web page that you have created has an Am I Right? button, but if you load the page and try it out, nothing happens. In order for something to happen in response to the click of the cmdGuess object, you need to add a short VBScript program to object.html.
VBScript programs can be put in a Web page by placing the programming commands in between an opening <SCRIPT> tag and a closing </SCRIPT> tag. The program is not displayed on-screen to Web users, but it can be seen by anyone who views the source code of the page.
This is one of the disadvantages of using a scripting language on a Web page. If some of the code needs to be hidden from users, a different programming solution such as Java or ActiveX must be used for the hidden parts.
The VBScript program inside a <SCRIPT> tag can be put anywhere in an HTML document. By convention, the code is put in the top part of a Web page between the opening <HEAD> tag and the closing </HEAD> tag.
Add the following HTML code to object.html one line below the starting <HEAD> tag:
<SCRIPT LANGUAGE="VBScript">
<!--
Sub cmdGuess_Click
If Form.TextBox1.Value = "pizza" Then
Form.cmdGuess.caption = "You're Right!"
Form.cmdGuess.enabled = 0
Else
Form.cmdGuess.caption = "Guess Again"
End If
End Sub
-->
</SCRIPT>
When you're done, the HTML source code file should resemble Listing 12.2.
Listing 12.2. The full HTML source code of the new object.html.
1: <HTML> 2: <HEAD> 3: <SCRIPT LANGUAGE="VBScript"> 4: <!-- 5: 6: Sub cmdGuess_Click 7: If Form.TextBox1.Value = "pizza" Then 8: Form.cmdGuess.caption = "You're Right!" 9: Form.cmdGuess.enabled = 0 10: Else 11: Form.cmdGuess.caption = "Guess Again" 12: End If 13: End Sub 14: 15: --> 16: </SCRIPT> 17: </HEAD> 18: <BODY> 19: <FORM NAME="Form"> 20: <OBJECT ID="Label1" WIDTH=96 HEIGHT=24 21: CLASSID="CLSID:978C9E23-D4B0-11CE-Bf2D-00AA003f40D0"> 22: <PARAM NAME="Caption" VALUE="The meaning of life (5 words or less): "> 23: <PARAM NAME="Size" VALUE="2540;635"> 24: <PARAM NAME="FontCharSet" VALUE="0"> 25: <PARAM NAME="FontPitchAndFamily" VALUE="2"> 26: <PARAM NAME="FontWeight" VALUE="0"> 27: </OBJECT> 28: <OBJECT ID="TextBox1" WIDTH=96 HEIGHT=24 29: CLASSID="CLSID:8BD21D10-EC42-11CE-9E0D-00AA006002f3"> 30: <PARAM NAME="VariousPropertyBits" VALUE="746604571"> 31: <PARAM NAME="Size" VALUE="2540;635"> 32: <PARAM NAME="FontCharSet" VALUE="0"> 33: <PARAM NAME="FontPitchAndFamily" VALUE="2"> 34: <PARAM NAME="FontWeight" VALUE="0"> 35: </OBJECT> 36: <P> 37: <OBJECT ID="cmdGuess" WIDTH=96 HEIGHT=32 38: CLASSID="CLSID:D7053240-CE69-11CD-A777-00DD01143C57"> 39: <PARAM NAME="Caption" VALUE="Am I Right?"> 40: <PARAM NAME="Size" VALUE="2540;846"> 41: <PARAM NAME="FontCharSet" VALUE="0"> 42: <PARAM NAME="FontPitchAndFamily" VALUE="2"> 43: <PARAM NAME="ParagraphAlign" VALUE="3"> 44: <PARAM NAME="FontWeight" VALUE="0"> 45: </OBJECT> 46: </FORM> 47: </BODY> 48: </HTML>
Load the Web page into an ActiveX-enabled browser and you can attempt to guess the meaning of life in five words or less. When you click the button labeled Am I Right?, it changes to Guess Again if you are incorrect. The button remains Guess Again until you answer the question by entering pizza in the text field. When that occurs, the button changes to You're Right! and becomes light gray in color. Nothing happens when the button is clicked after this point, because the button's Enabled property has been set to 0, which in VBScript is used to represent a boolean value of false. This is another advantage of using ActiveX controls as opposed to standard HTML forms. The developer can control which form elements can be accessed and can set Enabled to 0 for any buttons or input fields that should not be used at a given time.
Figure 12.5 shows a screen capture from the final version of object.html.
Figure 12.5 : The output of the final object.html.
After typing in all of these <OBJECT> tags and painstakingly entering the numbers of the CLASSID attribute, you might be getting the idea that it's difficult to add objects to a Web page. That's not really the case. You've been made to suffer a little bit in order to learn the HTML foundation of ActiveX controls.
In the next chapter, you can learn an easier way to add objects that will let you forget most of the things you just learned about CLASSID. The ActiveX Control Pad, a development tool made available by Microsoft, makes it possible to add controls to a page without typing any <OBJECT> tags.
The objects that you created for the meaning of life example used several different parameters to set their property values. Each control comes with its own set of properties that can be modified, with guidelines for how to change them. There are often 20 properties or more that can be used to configure a control, even for a relatively simple object such as those used in object.html.
Using a tool such as the ActiveX Control Pad, you can see every property and modify them by changing values on a dialog box.
Now that you are more familiar with the use of ActiveX controls on a page, the following chapters are good places to continue:
| I have used an onClick event in VBScript with an HTML intrinsic control, but the ActiveX control in the Workshop uses a Click event. Are these different? | |
| Yes. VBScript uses the Click event with an ActiveX control and the onClick event with the intrinsic HTML form elements. It's easy to mistake the two and use the wrong one when developing a VBScript program. If you try to use an onClick() subroutine with an ActiveX control, the program will be loaded without any errors, but the subroutine will never be called. | |
| Is there a way to set the initial values of a control from VBScript? | |
| You can create a main body of a VBScript by including code after the <SCRIPT> tag that is not included in a Sub statement. The VBScript interpreter assumes that this code should
be executed immediately after the page is loaded.
For example, the following VBScript program sets the initial value of the caption for an ActiveX control button called cmdClickMe: <SCRIPT> <!-- cmdClickMe.Caption = "Click If You Dare" --> </SCRIPT> | |
| I've written a complicated VBScript in which a text field changes more than once between user input. However, the only change that shows up on-screen is the last change. Why is this? | |
| An aspect of VBScript development that can frustrate programmers is the way it updates the Web page in response to VBScript. Screen updates do not take place each time a screen element is changed. Instead, all of the VBScript code is executed before the display changes. If you change a button's label to Click Me in line 22 of a subroutine, and change it again in line 706 to Don't Click Me, only Don't Click Me will be seen. |
